<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2019/9/29
  Time: 9:54
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>修改个人资料</title>
    <link rel="stylesheet" href="${path}/plugins/bootstrap/css/bootstrap.css" type="text/css">
    <link rel="stylesheet" href="${path}/plugins/bootstrap/css/animate.css" type="text/css">
    <link rel="stylesheet" href="${path}/plugins/bootstrap/css/font-awesome.css?v=4.4.0" type="text/css">
    <link rel="stylesheet" href="${path}/css/personCenter/person-center.css">
    <style>
        body {
            background-image: url(http://pzgv309jp.bkt.clouddn.com/faa30367-4e66-4b5a-8043-4b1f1df69cda.jpg);
            background-size: 650px 350px;
            background-repeat: repeat-x;
            background-position: 40% 50px;

        }

        input.error {
            border: 1px solid red;
        }

        label.error {


            padding-left: 16px;

            padding-bottom: 2px;

            font-weight: bold;

            color: #EA5200;
        }
    </style>
</head>
<body>
<%@include file="../common/nav_top.jsp"%>

<!-- 图片 begin -->
<div id="you">
    <span>悠 U旅行交友新方式</span><br>
    欢迎您!
</div>
<!-- 图片end -->
<!-- 面包屑 begin -->
<div class="container-fluid" style="margin-top: 150px;padding: 0px">
    <div class="row" style="margin: 0px 8%;font-size: 14px;">
        <ul class="breadcrumb" style="background-color: white">
            <li><a href="#">首页</a></li>
            <li><a href="#">我的悠U</a></li>
            <li class="active">我的订单</li>
        </ul>
    </div>
</div>
<!-- 面包屑 end -->
<!-- 个人中心 -->
<div class="container-fluid" style="margin-bottom: 20px;">
    <div class="row">
        <div class="col-md-1">
        </div>
        <!-- 左侧导航 begin -->
        <div class="col-md-2" style="padding: 0px">
            <!--  -->
            <div style="width: 75%;font-size: 14px;float: left;">
                <div id="leftnavs">
                    <a style="text-decoration: none;" class="list-group-item" name="change" onclick="person()">
                        <h3>我的悠U</h3>
                    </a>
                    <a class="list-group-item" name="change">
                        <span class="glyphicon glyphicon-tasks" onclick="person()"> 我的订单</span>

                    </a> </li>
                    <a href="../Tourist/myTraveler.html" class="list-group-item">
                        <span class="glyphicon glyphicon-flag"></span>&nbsp;我的导游

                    </a></li>
                    <a class="list-group-item" name="change" onclick="person()">
                        <span class="  glyphicon glyphicon-credit-card"></span> &nbsp;我的钱包
                    </a></li>
                    <a href="../traveler/myTraveler2.html" class="list-group-item">
                        <span class="glyphicon glyphicon-play-circle"></span>&nbsp;我的游记</a>
                    <a href="messages.html" class="list-group-item">
                        <span class="glyphicon glyphicon-bell"></span>&nbsp;系统通知</a></li>

                    <a class="list-group-item" name="change" onclick="person()">
                        <span class="glyphicon glyphicon-magnet"></span>&nbsp;个人资料</a>
                    <a href="#" class="list-group-item">
                        <span class="glyphicon glyphicon-user"></span>&nbsp;上传头像</a>
                </div>
            </div>
        </div>
        <!-- end -->
        <div class="col-md-8 list-group-item" style="background-color: rgb(235, 243, 247)" name="show">
            <div class="container-fluid">
                <div class="row">
                    <div>
                        <div style="font-size: 20px;margin-left: 30px;margin-top: 10px;">
                            个人资料
                            <hr style="background-color: gray;height:1px;margin-right: 50px;border: none">
                        </div>
                        <div id="text_3" class="container-fluid">

                            <div class="row" style="margin-left: 30%;margin-top: 150px">

                                <div style="float:left">

                                    <img src="http://py5ztkhmu.bkt.clouddn.com/3e776abb-ce52-496d-8ee2-95ceee27e907.png" width="50" height="50">
                                </div>
                                <div  style="float:left;margin-top: 5px;margin-left: 10px;margin-bottom: 200px">
                                    <h4> 您已经修改了个人资料</h4>
                                    请点击 <a  onclick="returnPerson()" style="text-decoration: none">此处返回</a>

                                </div>

                            </div>

                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>






<%@include file="../common/nav_bottom.jsp"%>
<!-- bootstrap中的js插件依赖于jquery框架,所以必须先引入jquery的js文件 -->
<script src="${path}/plugins/jquery/jquery.min.js"></script>
<!--引入bootstrap的js文件-->
<script src="${path}/plugins/bootstrap/js/bootstrap.min.js"></script>

<script src="${path}/js/person_center/swiper-3.4.0.jquery.min.js"></script>

<%--引用前端验证--%>
<script src="${path}/H+/js/plugins/validate/jquery.validate.min.js"></script>
<script src="${path}/H+/js/plugins/validate/messages_zh.min.js"> </script>
<script src=${path}/H+/js/plugins/validate/additional-methods.min.js"> </script>
<script>
    function returnPerson() {

        window.location='${path}/person';
    }

    //跳转个人中心
    function person() {

        window.location='${path}/person'

    }
    <%--手机号码验证--%>
    function checkPhone(obj){
        var phone=obj.value;
        var re= new RegExp("^1[3|4|5|8][0-9]\\d{4,8}$");
        if(null!=phone&&phone.length>0){
            if(!re.test(phone)){
                $("#phones").html("手机格式输入不正确!");
                document.getElementById("phoneFlag").value='false';
            }else {
                $("#phones").html("");
            }
        }
    }

    $.validator.setDefaults({
// submitHandler: function () {
//     alert("提交成功,请等待审核!");
// },
        errorPlacement: function (error, element) {
            error.appendTo(element.parent());
        }
    });



    $().ready(function () {
// 在键盘按下并释放及提交后验证提交表单
        $("#applyForm").validate({
            rules: {
                username: {
                    required: true,
                    minlength: 2,
                    maxlength: 7
                },
                sex: "required",
                phone: {
                    required: true,
                    minlength: 11,
                    maxlength: 11
                },
                intro: {
                    required: true

                },
                usualPlace:{
                    required: true
                },
                age:{
                    required: true,
                    maxlength:2
                },
                agree: "required"
            },
            messages: {
                realname: {
                    required: "请输入用户名",
                    minlength: "用户名必需由两个字母组成",
                    maxlength: "用户名最长为五个字母组成"
                },
                sex: {
                    required: "请选择您的性别",

                },
                phone: {
                    required: "请输入手机号码",
                    minlength: "请输入正确的手机号码",
                    maxlength: "请输入正确的手机号码"
                },
                usualPlace:{
                    required: "不能为空"
                },
                age:{
                    required: "年龄不能为空",
                    maxlength: "请输入两位数字"
                },

                agree: "请同意我们的协议",
                intro: "请填写介绍"

            }
        })

    });



</script>

</body>
</html>
